<template>
    <div class="appLogin-view">

      <div class="logo" style="background-color: white">
        <img src="../../assets/img/login/img_logo.png">
      </div>

      <div class="center">

        <div class="right">
          <div v-if="isViewType == 1">
            <div class="title">用户登录</div>

            <el-input v-model="name" placeholder="请输入手机号"></el-input>

            <el-input v-model="psw" show-password placeholder="请输入密码" @keyup.native.enter="enterClick"></el-input>

            <div class="other">
              <el-checkbox v-model="automatic">自动登录</el-checkbox>
              <a @click="backClick">忘记密码</a>
            </div>

            <el-button type="primary" @click="loginClick">登录</el-button>

            <div class="registerHint">
              <p>还没有注册?</p>
              <a class="register" @click="registerClick">立即注册</a>
            </div>

          </div>

          <div class="backView" v-else-if="isViewType == 2">
            <div class="title" @click="leftBack">
              修改密码
              <a class="leftBack">返回</a>
            </div>

            <el-input v-model="backPhone" placeholder="请输入手机号"></el-input>

            <div class="codeView">
              <el-input v-model="code" placeholder="请输入验证码"></el-input>

              <el-button @click="smsClick" :disabled="disable">{{codeStr}}</el-button>
            </div>

            <el-input v-model="backPsw" show-password placeholder="请输入新密码"></el-input>

            <el-input v-model="backPswTwo" show-password placeholder="请再次输入密码"></el-input>

            <el-button type="primary" @click="backPswClick">确认</el-button>
          </div>

          <div class="validationView" v-else-if="isViewType == 3">
            <div class="title" @click="leftBack">
              验证手机号
              <a class="leftBack">返回</a>
            </div>

            <div class="validationPhone">请验证手机号{{validationPhone}}</div>

            <div class="codeView">
              <el-input v-model="validationCode" placeholder="请输入验证码"></el-input>

              <el-button @click="smsClick1" :disabled="disable">{{codeStr}}</el-button>
            </div>

            <el-button type="primary" @click="validationClick">提交验证</el-button>
          </div>

        </div>

      </div>

    </div>
</template>

<script>
    import {setAutomatic,getAutomatic} from "../../utils/localStorageData";
    import {sendSms} from "../../api/common";
    import {setToken} from "../../utils/auth";
    import {forgetPwd,mobileCode} from "../../api/user";

    export default {
        name: "appLogin",
        data:function () {
            return{
                name:'',
                psw:'',
                isViewType:1,

                backPhone:'',
                code:'',
                codeStr:'发送验证码',
                disable:false,
                timer: null,
                count: '',
                backPsw:'',
                backPswTwo:'',
                automatic:false,

                validationPhone:'',
                validationCode:'',
            }
        },
        methods:{
            enterClick:function(){
                this.loginClick();
            },
            loginClick:function () {

                if (this.name == ""){
                    this.$message.error('请输入手机号');
                    return;
                }
                if (this.psw == ""){
                    this.$message.error('请输入密码');
                    return;
                }
                let data = {
                    account:this.name,
                    pwd:this.psw,
                }
                this.$store.dispatch("user/login",data).then((code)=>{

                    if (code != 200){
                        if (code == 410){

                            this.isViewType = 3;
                            this.validationPhone = this.name
                        }else {
                            this.$router.push({name:"enter"});
                        }
                    }else {

                        setAutomatic(this.automatic);
                        this.$store.dispatch("setting/setSystemSetting").then(()=>{
                            this.$store.dispatch("setting/setPrintSetting").catch((e) => {});
                        }).catch((e) => {});
                        this.$store.dispatch("setting/updataCheckTreatment",1)
                        this.$store.dispatch("setting/updataCheckTreatment",2)

                        this.$store.dispatch("user/getInfo").then((user)=>{
                            if (this.$route.query.backUrl){
                                this.$router.push({name:this.$route.query.backUrl})
                            }else {
                                if (user.menus.length && user.menus.length > 0){
                                    let index = 0;
                                    for (let i = 0; i < user.menus.length; i++){
                                        if (user.menus[i].code == "health"){
                                            index = i;
                                            break;
                                        }
                                    }
                                    this.$router.push(user.menus[index].path)
                                }else {
                                    this.$router.push("clinicManagement")
                                }
                            }
                        })
                    }

                }).catch((msg)=>{
                    this.$message.error(msg)
                })

            },
            registerClick:function () {
                this.$router.push("/register")
            },
            backClick:function () {
                this.isViewType = 2;
            },
            leftBack:function () {
                this.isViewType = 1;
            },
            smsClick:function () {
                if (this.backPhone == ""){
                    this.$message.error('请输入手机号');
                    return;
                }
                if (!this.RX.PHONE_RX.test(this.backPhone)){
                    this.$message.error('请输入正确手机号');
                    return;
                }
                let data = {
                    mobile:this.backPhone,
                    sms_key:'sms_auth'
                }
                sendSms(data).then((res)=>{
                    if (res.code == 200){
                        this.startTimer();
                        this.$message({
                            message: '验证码已发送',
                            type: 'success'
                        });
                    }
                })
            },
            smsClick1:function(){
                let data = {
                    mobile:this.validationPhone,
                    sms_key:'sms_auth'
                }
                sendSms(data).then((res)=>{
                    if (res.code == 200){
                        this.startTimer();
                        this.$message({
                            message: '验证码已发送',
                            type: 'success'
                        });
                    }
                })
            },
            backPswClick:function () {
                if (this.backPhone == ""){
                    this.$message.error('请输入手机号');
                    return;
                }
                if (this.code == ""){
                    this.$message.error('请输入验证码');
                    return;
                }
                if (this.backPsw == ""){
                    this.$message.error('请输入密码');
                    return;
                }
                if (this.backPswTwo == ""){
                    this.$message.error('请再次输入密码');
                    return;
                }
                if (this.backPswTwo != this.backPsw){
                    this.$message.error('两次密码不一致');
                    return;
                }
                let data = {
                    mobile:this.backPhone,
                    valid_code:this.code,
                    new_pwd:this.backPsw
                }
                forgetPwd(data).then((res)=>{
                    if (res.code == 200){
                        this.$message({
                            message: '修改成功',
                            type: 'success'
                        });
                        this.isBackPsw = false;
                    }else {
                        this.$message.error(res.msg);
                    }
                })
            },
            startTimer:function(){
                const TIME_COUNT = 60;
                if (!this.timer) {
                    this.count = TIME_COUNT;
                    this.disable = true;
                    this.timer = setInterval(() => {
                        if (this.count > 0 && this.count <= TIME_COUNT) {
                            this.count--;
                            this.codeStr = this.count + "(s)"
                        } else {
                            this.codeStr = "重新发送"
                            this.disable = false;
                            clearInterval(this.timer);
                            this.timer = null;
                        }
                    }, 1000)
                }
            },
            validationClick:function () {
                let data = {
                    mobile:this.validationPhone,
                    code:this.validationCode
                }
                mobileCode(data).then((res)=>{
                    if (res.code == 200){
                        this.$message({
                            message: '验证成功',
                            type: 'success'
                        });

                        setAutomatic(this.automatic);
                        this.$store.dispatch("setting/setSystemSetting").then(()=>{
                            this.$store.dispatch("setting/setPrintSetting").catch((e) => {});
                        }).catch((e) => {});
                        this.$store.dispatch("setting/updataCheckTreatment",1)
                        this.$store.dispatch("setting/updataCheckTreatment",2)

                        this.$store.dispatch("user/getInfo").then((user)=>{
                            if (this.$store.getters.menuConfig.length > 0){
                                let index = 0;
                                for (let i = 0; i < this.$store.getters.menuConfig.length; i++){
                                    if (this.$store.getters.menuConfig[i].code == "health"){
                                        index = i;
                                        break;
                                    }
                                }
                                this.$router.push(this.$store.getters.menuConfig[index].path)
                            }
                        })
                    }else {
                        this.$message.error(res.msg);
                    }
                })
            }
        }
    }
</script>

<style lang="scss">
  @import "@/assets/scss/login/appLogin.scss";
</style>
